﻿@model Sub.TaskPlanningDesk.WebSite.ViewModels.Projects.ProjectModel
@section Scripts
{
	<script src="@Url.Content("~/Scripts/jquery-ui-draggable.min.js")" type="text/javascript"></script>
	<script src="@Url.Content("~/Scripts/jquery.blockUI.js")" type="text/javascript"></script>
}
@{
	ViewBag.Title = "Task list";
}
@Html.HiddenFor(r => r.Project.ID)

<div class="centered">@Html.NavProject(Model.Project, true, false)</div>
<br />
<br />
<ul id="task-list">
	@for (int i = 0; i < Model.Tasks.Length; i++){
		<li>
			@Html.Hidden("taskID", Model.Tasks.ElementAt(i).ID)
			<div class="@(i % 2 == 0 ? "row" : "row alt")">
				<div class="@(Model.Tasks.ElementAt(i).IsDone ? "text done" : "text")">@Model.Tasks.ElementAt(i).Overview</div>
				<div class="action">@Html.NavTaskEdit(Model.Tasks[i])</div>
				<div class="action">@Html.NavTaskDone(Model.Tasks[i])</div>
				<br />
			</div>
		</li>
	}
</ul>
<br />
<br />
<div class="centered">@Html.NavTaskCreate(Model.Project.ID)</div>

<script type="text/javascript">
	$(document).ready(function () {
		$("#task-list").sortable({
			delay: 150,
			axis: 'y',
			stop: function (event, ui) {
				$('ul#task-list').block({
					message: '<img src="/Content/images/ajax-loader.gif" />'
				});

				var items = $('ul#task-list > li');
				var array = new Array();
				$.each(items, function (key, value) {
					array.push($(value).children("#taskID").val());
				});

				var projectID = $("#Project_ID").val();

				$.ajax({
					url: '/@(TheControllers.Task + "/" + TheActions.Project.ChangeOrder)',
					dataType: 'json',
					data: {
						projectID: projectID,
						newIDs: array.join('-')
					},
					success: function (result) {
						if (result)
							ChangeOrderSuccess();
						else
							ChangeOrderFailed();
					},
					error: function (jqXHR, textStatus, errorThrown) {
						ChangeOrderFailed();
					}
				});
			}
		});
	});

	function ChangeOrderSuccess() {
		FixGridStyles();
		$('ul#task-list').unblock();
	}
	function ChangeOrderFailed() {
		alert('error');
		$('ul#task-list').unblock();
	}
	function FixGridStyles() {
		var divs = $("div.row");
		$.each(divs, function(i, el){
			$(el).removeClass('alt');
			if(i%2 != 0)
				$(el).addClass('alt');
		});
	}
</script>
